<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
	<%
	String albumuuid = request.getAttribute("albumuuid")==null?"":request.getAttribute("albumuuid").toString();
	%>

	<script language="javascript">
	function popUp(){
			J('#createalbum').dialog({ id: 'd1', title: '创建相册', cover:true,page: '<%=request.getContextPath()%>/album?method=newAlbum', link: true, btns: false, width: 600, height: 450 }); 
	}
    function setzhaopianurl(){
		//alert(photoindex);
    	var obj = document.getElementById("zhaopianurl");
        var pobj = document.getElementById("myphoto");
		//alert(obj.value=="");
        if(obj.value==""){
        	pobj.src="<%=request.getContextPath()%>/images/no_photo_s.png";
        }else{
           	pobj.src="<%=request.getContextPath()%>/servlet/FileUploadManagerServlet?method=showImage&imgPath="+obj.value;
        }
    }
	</script>
    
<style type="text/css">
.photo
{
    margin-left:auto;
    margin-right:auto;
    margin-top:5px;
    width:100px;
    height:100px;
    overflow:hidden;
    background-color:#f8fdff;
    border:4px solid #f3f3f3;
    text-align:center;
    vertical-align:bottom;
    line-height:62px; 
    display:block;
}

.photoTitle
{
    margin-left:auto;
    margin-right:auto;
    display:table;
    padding-top:0px;
    
    *padding-left:15px;
    _padding-left:15px;
}
</style>
<script type="text/javascript" src="<%=path%>/include/FileUpload/fileUpload.js"></script>
<script type="text/javascript">
function delFile(preSavePath){
    //大照片的路径
	savePath = document.getElementById("myphoto").savePath;
    $.ajax({
		type: "POST", url: "<%=path%>/servlet/FileUploadManagerServlet?method=delImage&filePath="+savePath,
		data:$("#form1").serialize(),
		error:function(){alert("与服务器失去联系，请刷新本页面后再重试！");},
		success: function(msg){
			//页面去除img的属性
			$("#myphoto").attr("src","");
			$("#myphoto").attr("savePath","");
		}
	});
	
	//小照片的路径
	smallPath = document.getElementById("myphoto").smallPath;
	if(smallPath!=""){
		$.ajax({
			type: "POST", url: "<%=path%>/servlet/FileUploadManagerServlet?method=delImage&filePath="+smallPath,
			data:$("#form1").serialize(),
			error:function(){alert("与服务器失去联系，请刷新本页面后再重试！");},
			success: function(msg){
				//页面去除img的属性
				$("#myphoto").attr("src","");
				$("#myphoto").attr("smallPath","");
			}
		});
	}
 }


//上传组件参数初始化
//serverPath属性如果设置compress=true&width=168&height=200，则组件会按照这个尽寸对照片进行压缩
//serverPath属性如果设置compress=true，则组件会对图片按比例压缩，如果不设置compress属性，则不进行压缩
var setting={
	id:"FileUpload",
	swfPath:"<%=path%>/include/FileUpload/FileUploadSingle.swf",
	serverPath:"<%=path%>/servlet/FileUploadManagerServlet?method=savePhoto&compress=true&width=100&height=100",
	imgPath:"<%=path%>/include/FileUpload/uploadPhoto.jpg",
	width:90,
	height:20,
 	fileSize:"20",
	noFileType:"*.exe",
 	checkAndUploadExtend:checkAndUploadExtend,
 	uploadOnProgressExtend:uploadOnProgressExtend,
 	uploadCompleteExtend:uploadCompleteExtend
};


/*上传文件有效性判断*/
function checkAndUploadExtend(id,serverJson){

	//记录前一次上传的图片的url
	prePhotoSavePath = document.getElementById("myphoto").savePath;
    
	//如果你想获取当前上传组件参数的话
	//var parameters=FU.getSettingById[id];
	if(serverJson.checkType=="all"){
		//各种校验通过,如果你想在文件正式上传前做点什么的话，你就在这做吧！
		//alert("serverJson:"+serverJson);
		
		//$("#fileInfo").html(serverJson.fileName);
		//$("#json1").html(FU.jsonToStr(serverJson));
	}else if(serverJson.checkType=="suffix"){
		//文件后缀名有误
		alert("文件后缀名有误1");
	}else if(serverJson.checkType=="noSuffix"){
		//不允许的后缀名出错
		alert("不允许的后缀名有误1");
	}else if(serverJson.checkType=="size"){
		//文件大小有误
		alert("文件大小超过限制,请上传20以内的附件.");
	}
}

/*文件上传进度控制*/
function uploadOnProgressExtend(id,serverJson){
	var percentFormat=Math.floor(serverJson.percent*100);
	//$("#json2").html(FU.jsonToStr(serverJson));
	//$("#perspan").html(percentFormat+"%");
}

/*文件上传成功后，将服务器返回值返回到页面*/
function uploadCompleteExtend(id,serverJson){
	//如果你想在文件上传结束后做点什么的话，你就在这做吧！
	var imageObj = eval("("+serverJson+")");
	//alert("返回文件名："+imageObj.fileName);//返回文件名
	//alert("返回照片相对路径："+imageObj.imgPath);//返回照片相对路径
	//返回压缩后照片的相对路径,如果参数初始化setting中serverPath项设置了width和height,则后台会返回压缩后照片的相对路径
	//alert("返回压缩后照片的相对路径："+imageObj.smallImgPath);
	
	//页面读取大照片的url
	var imagurl = '<%=path%>/servlet/FileUploadManagerServlet?method=showImage&imgPath='+imageObj.imgPath;
	
	//也可以读取小照片的url
	var smallimag = '<%=path%>/servlet/FileUploadManagerServlet?method=showImage&imgPath='+imageObj.smallImgPath;
	var albumid = $("#albumuuid").val();
	$.ajax({
		type: "POST", 
		url: '<%=path%>/album?method=savePhoto&imgpath='+imageObj.imgPath+'&smallimgpath='+imageObj.smallImgPath,
		data:{albumuuid:albumid},
		error:function(){alert("与服务器失去联系，请刷新本页面后再重试！");},
		success: function(msg){}
		});
	//设置img的src属性
	if(imageObj.smallImgPath!=""){
		$("#myphoto").attr("src",smallimag);
	}else{
		$("#myphoto").attr("src",imagurl);
	}
	
	//在页面记录大照片的路径,方便取消上传时从页面用ajax删除大照片
	$("#myphoto").attr("savePath",imageObj.imgPath);
	
	//在页面记录小照片的路径,方便取消上传时从页面用ajax删除小照片
	$("#myphoto").attr("smallPath",imageObj.smallImgPath);
	
}


</script>
	<form name="frm">
	<table border="0" cellpadding="0" cellspacing="1" bgcolor="#CCCCCC" width="100%">
    <input type="hidden" id="albumuuid" name="albumuuid" value="<%=albumuuid%>" />
    <tr><td height="30">相册</td></tr>
    <tr>
    	<td height="30">
        <table border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" width="100%">
        <tr id="showaction" style="display:block;"><td height="30" colspan="3">
        	<script>
			//调用上传组件
			FU.iniFlashPlayer(setting);
			</script>
        </td></tr>
        
        <tr>
            	<td height="110" align="left">
                <input id="zhaopianurl" type="hidden" value="">
                <table border="0" cellpadding="0" cellspacing="1" height="110" width="110" bgcolor="#CCCCCC">
                <tr>
                	<td width="100%" height="100%" bgcolor="#FFFFFF" align="center" valign="middle">
                <img id="myphoto" name="myphoto" savePath="" alt="" width="100" height="100" src="" style="border: 4px; border-color:#CCCCCC;" />
                	</td>
                </tr>
                </table>
                <script language="javascript">
                <!--
                setzhaopianurl();
                -->
                </script> 
                </td>
        </tr>
        
        
        </table>
        </td>
    </tr>
    </table>
    </form>
    
    